<template>
   <view class="container">
      <view class="title">{{ activity.activityName }}</view>
      <view class="subtitle">{{ activity.startTime }}~{{ activity.endTime }}</view>
      <view >
		  <rich-text :nodes="contentText"></rich-text>
	  </view>
    </view>

</template>

<script>
  import { getLove } from "@/api/system/love"
  import config from "@/config.js" // 全局配置文件
  export default {
    data() {
      return {
        activity: {},
		contentText:""
      }
    },
    onLoad(options) {
      this.getLove(options.id);
    },
    methods: {
      getLove(id) {
        getLove(id).then(response => {
          this.activity = response.data
           this.contentText = this.dealTxt(this.activity.activityText);
        })
      },
	  dealTxt(htmlStr) {
	  				let apiSource = config.baseUrl; // 地址端口
	  				const _imgL = '<img src="';
	  				const _video = '<video src="'
	  				const _href = '<a href="'
	  			
	  				if (htmlStr) {
	  					// 解析富文本，获取所有图片标签或链接
	  					const regex = /<img.*?src=["'](.*?)["']/g;
	  					const images = [];
	  					let match;
	  					while ((match = regex.exec(htmlStr)) !== null) {
	  						images.push(match[1]);
	  					}
	  					// 遍历每个图片链接，判断是否有前缀
	  					for (const image of images) {
	  						if (image.startsWith('http://') || image.startsWith('https://')) {
	  						} else {
	  							// 给没有前缀的图片URL添加apiSource前缀
	  							if (htmlStr.includes(_imgL)) {
	  								htmlStr = htmlStr.replace(/<img src=\"/g,
	  									'<img style="width:100%;height:auto" class="ui-iva" src="' + apiSource)
	  							}
	  						}
	  					}
	  					if (htmlStr.includes(_video)) {
	  						htmlStr = htmlStr.replace(/<source src=\"/g, '<source src="ui-iva' + apiSource)
	  					}
	  					if (htmlStr.includes(_href)) {
	  						htmlStr = htmlStr.replace(/<a href=\"/g, '<a href="' + apiSource)
	  					}
	  			
	  				}
					htmlStr = htmlStr.replace(/(\/dev-api)/g, "");
	  				return htmlStr;
	  			}

    }
  }
</script>

<style lang="scss">
  page {
    background-color: #ffffff;
  }
  .container {
    padding: 20px;
  }
  .title {
    font-size: 20px;
    font-weight: bold;
	text-align: center;
    margin-bottom: 10px;
  }
  .subtitle {
    font-size: 18px;
	text-align: center;
    color: #888;
    margin-bottom: 20px;
  }
</style>
